<% include ../partials/header.html %>
<!-- 轮播图 开始 -->
<div class="bannerWrap">
	<ul class="bannerGroup">
		<li class="current">
			<a href="javascript:;" title="这是什么" style="background: url(/public/img/banner1.png) no-repeat center;"><img src="/public/img/banner1.png" alt=""></a>
		</li>
		<li>
			<a href="javascript:;" title="这是什么" style="background: url(/public/img/banner2.png) no-repeat center;"><img src="/public/img/banner2.png" alt=""></a>
		</li>
		<li>
			<a href="javascript:;" title="这是什么" style="background: url(/public/img/banner3.jpg) no-repeat center;"><img src="/public/img/banner3.jpg" alt=""></a>
		</li>
		<li>
			<a href="javascript:;" title="这是什么" style="background: url(/public/img/banner4.jpg) no-repeat center;"><img src="/public/img/banner4.jpg" alt=""></a>
		</li>
	</ul>
	<div class="arrowGroup dn">
		<b arrow="prev" class="arrowLeft" title="上一个"></b>
		<b arrow="next" class="arrowRight" title="下一个"></b>
	</div>
	<div class="dotGroup" id="dotGroup">
		<i class="current"></i>
		<i></i>
		<i></i>
		<i class="mr0"></i>
	</div>
</div>
<!-- 轮播图 结束 -->

<!-- 服务介绍 开始 -->
<div class="serviceWrap">
	<div class="clr ourService">
		<div class="serviceHeader">我们做什么</div>
		<div class="serviceDesc">
			<p>主要从事企业宣传片、微电影、产品形象设计等艺术范畴的工作。</p>
			<p>书然做的不仅仅是影视动画，更是一场视听盛宴，不仅仅是宣传载体，也是传达品牌理念的工具。</p>
			<p>你的灵魂设计师，非书然莫属。书然的缪斯，非你不可。</p>
		</div>
		<ul class="clr serviceBlocks" id="serviceBlocks">
			<li class="xuanchuan">
				<dl>
					<dt>宣传片</dt>
					<dd>提取产品的缔造价值，挖掘企业的商业价值，展现缔造者的梦想价值。</dd>
				</dl>
			</li>
			<li class="guanggao">
				<dl>
					<dt>广告片</dt>
					<dd>我们"穷"凶极恶的想创意，我们"富"甲一方的对待你！</dd>
				</dl>
			</li>
			<li class="microMovie">
				<dl>
					<dt>微电影</dt>
					<dd>用故事化的手法包装产品形象，推广品牌内涵，剧情浓缩，创意绝不打折。</dd>
				</dl>
			</li>
			<li class="otherService mr0">
				<dl>
					<dt>其他服务</dt>
					<dd>其他服务：平面拍摄、平面设计、三维动画制作、网络推广</dd>
				</dl>
			</li>
		</ul>
	</div>
</div>
<!-- 服务介绍 结束 -->

<!-- 案例介绍 开始 -->
<div class="caseWrap">
	<div class="caseConcact">
		<div class="concactus fr">
			<h3>联系书然</h3>
			<ul class="ourContact clr">
				<li class="contact_phone_bg"><a href="javascript:;">021-69976089</a></li>
				<li class="contact_mobile_bg"><a href="javascript:;">13917585979</a></li>
				<li class="contact_email_bg"><a href="javascript:;">625940008@qq.com</a></li>
			</ul>
		</div>
		<div class="successCase">
			<h3>成功案例</h3>
			<div class="flowCase">
				<ul id="slideImgWrap">
					<li><a href="javascript:;" target="_blank"><img src="/public/img/bnz.png" alt="百年樟"></a></li>
					<li><a href="javascript:;" target="_blank"><img src="/public/img/shanghai_secuity.png" alt="上海保安"></a></li>
					<li><a href="javascript:;" target="_blank"><img src="/public/img/east_university.png" alt="东华大学"></a></li>
					<li class="mr0"><a href="javascript:;" target="_blank"><img src="/public/img/haipai.png" alt="海派"></a></li>
					<li class="dn"><a href="javascript:;" target="_blank" title="sofo"><img src="/public/img/sofo.png" alt="sofo"></a></li>
					<li class="dn"><a href="javascript:;" target="_blank" title="红星美凯龙"><img src="/public/img/macaline.png" alt="红星美凯龙"></a></li>
					<li class="dn"><a href="javascript:;" target="_blank" title=""><img src="/public/img/naturally.png" alt=""></a></li>
					<li class="dn"><a href="javascript:;" target="_blank" title="新浪上海"><img src="/public/img/sina.png" alt="新浪上海"></a></li>
					<li class="dn"><a href="javascript:;" target="_blank" title="明德"><img src="/public/img/meitoku.png" alt="明德"></a></li>
					<li class="dn"><a href="javascript:;" target="_blank" title="investment"><img src="/public/img/investment.png" alt="investment"></a></li>
					<li class="dn"><a href="javascript:;" target="_blank" title="迈卓牛排房"><img src="/public/img/manzo.png" alt="迈卓牛排房"></a></li>
					<li class="dn"><a href="javascript:;" target="_blank" title="上海地铁"><img src="/public/img/metro.png" alt="上海地铁"></a></li>
					<li class="dn"><a href="javascript:;" target="_blank" title="R-tech"><img src="/public/img/rtech.png" alt="R-tech"></a></li>
					<li class="dn"><a href="javascript:;" target="_blank" title="爱尔格丽"><img src="/public/img/airgeli.png" alt="爱尔格丽"></a></li>
					<li class="dn"><a href="javascript:;" target="_blank" title="SSJD"><img src="/public/img/milk.png" alt="SSJD"></a></li>
				</ul>
				<span class="prevCase" id="btn_prev"></span>
				<span class="nextCase" id="btn_next"></span>
			</div>
		</div>
	</div>
</div>
<!-- 案例介绍 结束 -->

<!-- QQ客服面板 开始 -->
<div class="qqPannel">
	<div class="pannel dn" id="pannelMain">
		<h1>QQ在线客服</h1>
		<h2>在线咨询</h2>
		<ul>
			<li><a href="javascript:;" title="QQ在线"></a></li>
			<li><a href="javascript:;" title="QQ在线"></a></li>
			<li class="bn"><a href="javascript:;" title="QQ在线"></a></li>
		</ul>
	</div>
	<div class="pannelLeft" id="pannelLeft" title="在线客服"></div>
</div>
<!-- QQ客服面板 结束 -->

<script src="/public/js/lib/playScroll.js"></script>
<script src="/public/js/lib/slideimgtab.js"></script>
<% include ../partials/footer.html %>